<template>
  <div class="mains" v-color="'bgkImg'">
    <dz-lang></dz-lang>
    <dz-popus :form="form"></dz-popus>
    <dz-home-swiper :list="list"></dz-home-swiper>
    <dz-card @openBox="openBox" :list="dzCard"></dz-card>
    <dz-video :form="video"></dz-video>
    <dz-member>
      <template slot="title"><van-icon name="friends-o" size="20"/> <qq>Member</qq></template>
      <template slot="content">
        <dz-box v-for="(item,index) in dzbox" :item="item" :index="index" :key="index" :is-rank="false"/>
      </template>
    </dz-member>
    <dz-member>
      <template slot="title"><van-icon name="manager-o" size="18" /> <qq>Merchant</qq></template>
      <template slot="content">
        <dz-box v-for="(item,index) in dzbox" :item="item" :index="index" :key="index" :is-rank="true"/>
      </template>
    </dz-member>
    <van-popup v-model="show" closeable round>
      <div class="box-2">
        <dz-video :form="video"></dz-video>
      </div>
    </van-popup>
    <dz-safe></dz-safe>
  </div>
</template>

<script>

import {getBanner, HomeIncome, newsRecord} from "@/api/apiFox";

  export default {
    data(){
      return{
        form:{},
        video:'',
        list:[],
        dzCard:[
          {imgUrl:require('@/assets/images/img_01.png'),name:this.$t('Video')},
          {imgUrl:require('@/assets/images/Projectintroduction.png'),name:this.$t('Project')},
          {imgUrl:require('@/assets/images/HelpCenter.png'),name:this.$t('Help')},
        ],
        dzbox:[],
        dzBox2:[],
        show:false
      }
    },
    methods:{
      getLists(){
        HomeIncome().then(res=>{
          console.log(res)
          this.form = res.income
          if (res.member && res.member.list1.length>0){
            res.member.list1.forEach(value=>{
              value.pic = require(`@/assets/images/${value.pic}.png`)
            })
          }
          if (res.member && res.member.list2.length>0){
            res.member.list2.forEach(value=>{
              value.pic = require(`@/assets/images/${value.pic}.png`)
            })
          }
          this.dzbox = res.member.list1
          this.dzBox2 = res.member.list2
        }).catch(err=>{})
        let f = {
          language: "ZH_EN",
          officialType: 13
        }
        newsRecord(f).then(res=>{
          console.log(res)
          if (res && res.length>0){
            this.video = res[0].jumpLink
          }
        }).catch(err=>{})

        getBanner().then(res=>{
          console.log(res)
          this.list=res
        }).catch(err=>{})
      },

      openBox(item){
        console.log(item)
        switch (item){
          case 0:{
            this.show=true
            break
          }
          case 1:{
            this.$router.push('/introduct').catch(err=>{})
            break
          }
          case 2:{
            this.$router.push('/help').catch(err=>{})
            break
          }
        }
      }
    },
    mounted() {
      this.getLists()
    }
  }
</script>

<style scoped lang="scss">
.mains{
  width: 100%;
  min-height: 100vh;
  .box-2{
    width: 360px;
    height: 220px;
  }
}
</style>